// 蛇对象
(function (window, undefined) {
  // 蛇类
  class Snick {
    // 构造函数
    constructor(obj) {
      // 检测用户输入数据是否符合要求
      obj = obj instanceof Object ? obj : {}
      // 设置蛇的宽和高、蛇节标签数组，蛇位置数据数组，蛇头运动方向
      this.width = obj.width || 10
      this.height = obj.height || 10
      this.ele = []
      this.item = [{
          x: 2,
          y: 2,
          color: 'red'
        },
        {
          x: 1,
          y: 2,
          color: 'blue'
        },
        {
          x: 0,
          y: 2,
          color: 'blue'
        }
      ]
      this.direction = 'right'
    }
    // 原型方法
    // 蛇的渲染方法
    render(father) {
      // 循环遍历蛇的数据
      for (const k of this.item) {
        // 创建蛇元素
        const me = document.createElement('span')
        // 蛇元素行内样式
        me.style.position = 'absolute'
        me.style.width = `${this.width}px`
        me.style.height = `${this.height}px`
        me.style.left = `${k.x*this.width}px`
        me.style.top = `${k.y*this.height}px`
        me.style.borderRadius = `50%`
        me.style.backgroundColor = k.color
        // 把蛇节添加到舞台
        father.appendChild(me)
        // 把蛇节添加到蛇节元素数组
        this.ele.push(me)
      }
    }
    // 蛇位置更新方法
    upDate() {
      //蛇运动的时候，除蛇头外每节蛇身都会移动到上一节蛇身的位置，所以，只需要把每一节蛇身的x和y值设置为上一节蛇身的x和y值即可
      for (let i = this.item.length - 1; i > 0; i--) {
        this.item[i].x = this.item[i - 1].x
        this.item[i].y = this.item[i - 1].y
      }
      // 修改蛇头位置数据，根据蛇头运动方向变化
      switch (this.direction) {
        case 'right':
          this.item[0].x += 1
          break;
        case 'left':
          this.item[0].x -= 1
          break;
        case 'up':
          this.item[0].y -= 1
          break;
        case 'down':
          this.item[0].y += 1
          break;
      }
    }
    // 蛇删除方法
    delete(father) {
      // 遍历所有蛇身，从舞台删除
      for (const i of this.ele) {
        father.removeChild(i)
      }
      // 清空蛇身
      this.ele = []
    }
  }
  // 把蛇类托管到window
  window.Snick = Snick
})(window, undefined)